<template>
	<view>
		<video class="swiper" :src="videoMes.url" style="width:100%;"></video>
		<view class="info">
			<view>{{videoMes.name}}</view>
			<view class="sm">上传时间：{{videoMes.created_at | time}}</view>
		</view>
	</view>
</template>

<script>
	import uniLoadMore from "@/components/uni-load-more/uni-load-more.vue"
	import {
		Video
	} from '@/model/video.js';
	var video = new Video();
	import {
		Adv
	} from '@/model/adv.js';
	var adv = new Adv();
	import moment from '@/utils/moment';
	export default {
		components: {
			uniLoadMore
		},
		data() {
			return {
				page: 1,
				rooms: [],
				loadStatus: 'more',
				cate_id: '',
				id: '',
				videoMes: {}
			}
		},
		onLoad(options) {
			this.cate_id = options.cate_id ? options.cate_id : '';
			this.id = options.id ? options.id : '';
			this.detail();
		},
		onPullDownRefresh() {

		},
		filters: {
			// 时间格式化
			time(val) {
				return moment(val * 1000).format('MM-DD HH:mm');
			},
		},
		methods: {
			//获得视频详情
			detail: function() {
				var that = this;
				var params = {
					id: that.id
				};
				video.detail(params, (data) => {
					that.$data.videoMes = data.data;
				});
			},
		}

	}
</script>

<style lang="scss">
	.title {
		padding: 30rpx 2%;
	}

	.sm {
		color: #999;
		margin-top: 20rpx;
		font-size: 24rpx;
	}

	page {
		background-color: #fff;
	}

	.swiper {
		min-height: 360rpx;
	}

	.center {
		margin: 0 auto;
	}

	.slide-image {
		width: 100%;
	}

	.tab {
		display: flex;
		margin: 20rpx 0 20rpx 0;
	}

	.tab-item {
		flex: 1;
		text-align: center;
	}

	.tab-name {
		width: 100rpx;
		margin: 0 auto;
		padding: 20rpx 0;
		color: #666;
	}

	.item-active {
		border-bottom: 4rpx solid #ff4400;
		color: #ff4400;
	}

	.video-list {
		display: flex;
		flex-wrap: wrap;
	}

	.video-2 {
		width: 49%;
		margin-bottom: 50rpx;
	}

	.video-2:nth-child(odd) {
		margin-right: 2%;
	}

	.video-2 .cover image {
		width: 100%;
	}

	.video-name {
		color: #111;
		padding-left: 20rpx;
		font-size: 32rpx;
		line-height: 38rpx;
		max-height: 76rpx;
		overflow: hidden;
		margin-top: 10rpx;
	}

	.video-description {
		color: #999;
		padding-left: 20rpx;
		font-size: 28rpx;
		margin-top: 10rpx;
		line-height: 36rpx;
		max-height: 72rpx;
		overflow: hidden;
	}

	.video {
		height: 100%;
	}

	.info {
		padding: 30rpx 2%;
		// border-bottom: 1px solid #ececec;
	}
</style>
